function get_right(stateInfo,shapeShifterId){
        var elem = document.getElementById(shapeShifterId);
        var group_id = stateInfo.value.split(':')[0];                                                                   
        if(group_id == undefined || group_id == ''){
                elem.innerHTML='';
                return;
        }         
        elem.innerHTML='';                                                
        var grantarr=new Array();
        var rolearr=new Array();
        var i=0;
        {% for grant in grant_list %} 
        grantarr[i] = new Array(2);                                                                
        grantarr[i][0]="{{grant['group_id']}}";
        grantarr[i][1]="{{grant['role_id']}}";
        i++;                                                                                   
        {% endfor %}
         var i=0;
        {% for role in role_list %} 
        rolearr[i] = new Array(2);                                                                
        rolearr[i][0]="{{role['id']}}";
        rolearr[i][1]="{{role['name']}}";                                
        i++;                                                                                   
        {% endfor %}
        var str=show_right(rolearr,grantarr,group_id);
        elem.innerHTML=str;  
} 
function check_right(){
        var flag=false;
        var rights = document.getElementsByName('role_id');
        var len = rights.length;
        for (i=0;i<len;i++){
                if(rights[i].checked==true){
                        flag=true;
                        break;
                }
        }
        if(flag==true){ 
                return true;
        }else{
                alert('No right checked,Please check one!');
                return false;
        }
}
function show_right(arr1,arr2,var1){
        var str="<ul>";
        var rolearr=arr1;
        var grantarr=arr2;
        var group_id=var1;        
        var len1 = rolearr.length;
        var len2 = grantarr.length;
        for(i=0;i<len1;i++){           
                var checked="";
                if(len2>0){
                        for(j=0;j<len2;j++){
                                if(group_id==grantarr[j][0] && rolearr[i][0]==grantarr[j][1]){
                                        checked="checked='checked'";
                                } 
                        }
                        str+="<li><input type='checkbox' id='rolelist"+i+"' value='"+rolearr[i][0]+"' name='role_id' "+checked+" /><label for='rolelist"+i+"'>"+rolearr[i][1]+"</label></li>";
                }
        } 
        str+="<li><input id='select_all' type='checkbox' onclick=\"selectAll('role_id');\"/><label for='select_all'>Select All</label></li>";
        str+="</ul>"
        return str;
}
